<%--
  Created by IntelliJ IDEA.
  User: huashuowei
  Date: 2019/4/20
  Time: 15:41
  To change this template use File | Settings | File Templates.
  <%@ page import="User.UserDTO" %>
--%>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <title>Login_Register</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="Career Multi Forms Responsive Widget,Login form widgets, Sign up Web forms , Login signup Responsive web form,Flat Pricing table,Flat Drop downs,Registration Forms,News letter Forms,Elements" />
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
    function hideURLbar(){ window.scrollTo(0,1); } </script>
    <!-- Meta tag Keywords -->
    <!-- css files -->
    <link rel="stylesheet" href="css/style.css" type="text/css" media="all" /> <!-- Style-CSS -->
    <link rel="stylesheet" href="css/font-awesome.css"> <!-- Font-Awesome-Icons-CSS -->
    <!-- //css files -->
    <link href="//fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&amp;subset=latin-ext,vietnamese" rel="stylesheet">

    <!-- js -->
    <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
    <!-- //js -->
</head>
<body>
<script src="js/jquery.vide.min.js"></script>
<!-- main -->
<div data-vide-bg="video/Ipad">
    <div class="center-container">
        <div class="w3ls-header">
            <h1>Login AND Register</h1>
            <div class="header-main">

                <div class="videologin">

                    <div class="top-login first">
                        <div class="border">
                            <span><i class="fa fa-user-circle-o" aria-hidden="true"></i></span>
                        </div>
                    </div>
                    <h2>Login Form</h2>
                    <div class="header-bottom">
                        <div class="header-right w3agile">
                            <div class="header-left-bottom agileinfo">
                                <form action="#" method="post">
                                    <div class="icon1">
                                        <i class="fa fa-user-o" aria-hidden="true"></i>
                                        <input  type="text" placeholder="Your name" required=""/>
                                    </div>
                                    <div class="icon1">
                                        <i class="fa fa-unlock-alt" aria-hidden="true"></i>
                                        <input type="password" placeholder="password" required=""/>
                                    </div>
                                    <label class="anim">
                                        <input type="checkbox" class="checkbox">
                                        <span> Stay logged in </span>
                                    </label>
                                    <a href="#" class="forgot">forgot password?</a>
                                    <div class="bottom">
                                        <input type="submit" value="Login" />
                                    </div>
                                    <div class="header-left-top">
                                        <div class="sign-up"> <h5>or</h5>
                                            <h4>login with</h4></div>
                                    </div>
                                    <div class="header-social wthree">
                                        <ul>
                                            <li><a href="#" class="f"><i class="fa fa-facebook" aria-hidden="true"></i>Facebook</a></li>
                                            <li><a href="#" class="t"><i class="fa fa-twitter" aria-hidden="true"></i>Twitter</a></li>
                                            <li><a href="#" class="g"><i class="fa fa-google-plus" aria-hidden="true"></i>Google+</a></li>
                                            <li><a href="https://cas.dgut.edu.cn?appid=javaee&state=STATE" aria-hidden="true"><i class="fa fa-guangong"></i></a></li>
                                        </ul>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="videoregister">

                    <div class="top-login second">
                        <div class="border">
                            <span><i class="fa fa-user-circle" aria-hidden="true"></i></span>
                        </div>
                    </div>
                    <h3>register Form</h3>
                    <div class="header-bottom">
                        <div class="header-right w3agile">
                            <div class="header-left-bottom agileinfo">
                                <form action="#" method="post">
                                    <div class="icon1">
                                        <i class="fa fa-user-o" aria-hidden="true"></i>
                                        <input  type="text" placeholder="Your name" required=""/>
                                    </div>
                                    <div class="icon1">
                                        <i class="fa fa-envelope-o" aria-hidden="true"></i>
                                        <input type="email" placeholder="Your email" required=""/>
                                    </div>
                                    <div class="icon1">
                                        <i class="fa fa-phone" aria-hidden="true"></i>
                                        <input type="tel" placeholder="Phone number" required=""/>
                                    </div>
                                    <div class="icon1">
                                        <i class="fa fa-unlock-alt" aria-hidden="true"></i>
                                        <input type="password" placeholder="Create password" required=""/>
                                    </div>
                                    <div class="icon1">
                                        <i class="fa fa-unlock-alt" aria-hidden="true"></i>
                                        <input type="password" placeholder="Confirm password" required=""/>
                                    </div>
                                    <div class="bottom">
                                        <input type="submit" value="Register" />
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="clear"></div>
            </div>

            <!-- copyright start here -->
            <div class="copyright">
                <p>© 2019 JAVEE DGUT</p>
            </div>
            <!--copyright end here-->
        </div>
        <!--header end here-->
    </div>
</div>
</body>
</html>